<template>
    <div>
        <div class="repairSuccess">
            <div class="repairSuccessTop">
                <i class="iconfont icon-icon-test"></i>
                <span>充值成功</span>
            </div>
            <div class="sdDredge">
                <h2 class="repairTit">
                    <strong></strong>
                    <span>充值详情</span>
                </h2>
                <div class="repairSuccessContent">
                    <p><span>手机号：</span>{{ chongzhi.phone}}</p>
                    <p><span>姓名：</span>{{ chongzhi.name}}</p>
                    <p><span>充值金额：</span>{{ chongzhi.money}}</p>
                    <p><span>充值时间：</span>{{ chongzhi.time}}</p>
                    <p><span>当前状态</span>{{ chongzhi.status}}</p>
                </div>
                <br><br><br>
                <a class="cz-back" :href="back()">返回</a>
            </div>
        </div>
    </div>
</template>

<script>
import { mapState } from 'vuex'
export default {
    computed: {
        ...mapState({
            chongzhi: state => state.chongzhi
        })
    },
    methods:{
        back(){
            return '/person'
        }
    }
}
</script>


<style lang="scss" scoped>
    @import '@/assets/style/repair.scss';
    a.cz-back{
        display: block;
        background: #FF5723;
        height: 48px;
        margin: 15px;
        color: #fff;
        font-size: 16px;
        text-align: center;
        line-height: 48px;
        letter-spacing: 5px;
        border-radius: 5px;
    }
</style>
